<template>
	<view>
		<u-gap></u-gap>
		<view class="box">
			<!-- <u-input type="text" focus height="100" v-model="value" placeholder="请输入修改内容（限制8个字以内）" maxlength="8" /> -->
			<u-field :border-bottom="false" label-width="0" @confirm="confirm" focus v-model="value" label=" " placeholder="请输入修改内容（限制8个字以内）">
			</u-field>
		</view>
		<view class="btn" @click="confirm">
			确定
		</view>
	</view>
</template>

<script>
 import {appletImgUrl} from "@/common/config.js"
	export default {
		data() {
			return {
				appletImgUrl:appletImgUrl,
				value: uni.getStorageSync('userInfo').nickName
			};
		},
		onLoad() {

		},
		methods: {
			async confirm() {
				if (this.value == uni.getStorageSync('userInfo').nickName) {
					uni.showToast({
						title: '昵称相同，换个名字吧',
						icon: 'none'
					})
					return
				}
				await this.$u.post('user/info/update', {
					nickName: this.value
				})
				let userInfo = await this.$u.get('user/info')
				if(userInfo.headPhoto){
					if(userInfo.headPhoto.indexOf("https") != 0){
						userInfo.headPhoto = this.imageURL + userInfo.headPhoto
					}
				}else{
					userInfo.headPhoto = this.appletImgUrl+'logo.png'
				}
				uni.setStorageSync('userInfo', userInfo)
				uni.showToast({
					title: '修改成功'
				})
				setTimeout(() => {
					uni.navigateBack()
				}, 1500)
			}
		}
	}
</script>

<style lang="scss">
	.btn {
		line-height: 100rpx;
		margin-top: 350rpx;
		font-size: 30rpx;
		color: #FFFFFF;
		text-align: center;
		background: linear-gradient(90deg, #FF3868, #FC6161);
		box-shadow: 1px 10px 15px 2px rgba(255, 78, 70, 0.3);
		border-radius: 20rpx;
	}

	page {
		background-color: #f7f7f7;
		box-sizing: border-box;
		padding: 0 30rpx;
	}

	.box {
		background-color: #FFFFFF;
		// padding: 0 30rpx;
		border-radius: 20rpx;
	}
</style>
